<template>
  <div class="app-container">
    <el-collapse>
      <el-collapse-item title="流程审批记录" name="1">
        <el-timeline style="margin-top: 5px;">
          <el-timeline-item
            v-for="(activity, index) in activities"
            :key="index"
            :color="activity.endTime?'#0bbd87':''"
            :timestamp="parseTime(activity.startTime)"
          >
            <span v-if="activity.endTime">
              <el-tag v-if="activity.deleteReason" type="danger">已撤销</el-tag>
              <el-tag v-else type="success">已处理</el-tag>
            </span>
            <el-tag v-else type="info">未处理</el-tag>
            <el-tag v-if="activity.description.indexOf('【同意】')>=0" type="success">通过</el-tag>
            <el-tag v-if="activity.description.indexOf('【不同意】')>=0" type="warning">不通过</el-tag>
            <p style="color:#909399">
              <label>审批环节：</label>
              {{activity.taskName}}
            </p>
            <p style="color:#909399">
              <label>审批人：</label>
              {{activity.assignee}}
            </p>
            <p style="color:#909399">
              <label>审批意见：</label>
              {{activity.description}}
            </p>
          </el-timeline-item>
        </el-timeline>
      </el-collapse-item>
    </el-collapse>
  </div>
</template>
  
  <script>
import { historyWorkFlowList } from "@/api/workflow/notRetrunedApply";

export default {
  name: "approvalHistory",
  props: {
    processId: String
  },
  data() {
    return {
      activities: []
    };
  },

  mounted() {
    this.historyWorkFlowList();
  },
  methods: {
    historyWorkFlowList() {
      //查询审批历史记录
      historyWorkFlowList({ processInstanceId: this.processId }).then(resp => {
        console.log(resp);
        this.activities = resp.data;
      });
    }
  }
};
</script>
  